<template>
    <div>
        <ul v-for="(item, index) in todoList" :key="index">
        <Item   :item="item"  :index="index"  :delList="delList" :changeStatu="changeStatu"/>
    </ul>
    </div>

  
</template>

<script lang="ts">
// import per component
import Item from "./Item.vue";

import { defineComponent ,reactive,ref} from "vue";
export default defineComponent({
    name:'List',
    components: {
        Item
    },
    props: {
        todoList : {
            type: Array,
            required: true
        },
        delList: {
            type: Function,
            required: true
        },
        changeStatu: {
            type: Function,
            required: true
        }
    },
    setup (props) {
        
        return {

        }
    }
})
</script>

<style scoped>
    ul {
        width: 500px;
        margin: 10px auto;
        padding: 0;
    }
</style>